<template>
    <!-- 添加或修改产品分类对话框 -->
  <el-dialog :title="title" :visible.sync="open" width="500px"  append-to-body :close-on-click-modal="false" custom-class="show-back-class">
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-row>
          <el-col :xs="24" :sm="24" :lg="24"  >
            <el-form-item label="分类级别" prop="level">
              <el-select v-model="form.level" placeholder="请选择分类级别" style="width: 100%">
                <el-option class="index-option" v-for="dict in $store.state.factorDict.productCategorizeOptions" :disabled="form.id!=null"
                           :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :lg="24"  >
            <el-form-item label="门类" prop="parentCode0" v-if="form.level>0">
              <el-select v-model="form.parentCode0" placeholder="请选择分类级别" style="width: 100%">
                <el-option class="index-option" v-for="dict in $store.state.factorDict.productCategorizeDict0" :disabled="form.id!=null"
                           :key="dict.code" :label="dict.chineseName" :value="dict.code" />
              </el-select>
            </el-form-item>
            <el-form-item label="大类" prop="parentCode1" v-if="form.level>1">
              <el-select v-model="form.parentCode1" placeholder="请选择分类级别" style="width: 100%">
                <el-option class="index-option" v-for="dict in $store.state.factorDict.productCategorizeDict1" v-if="dict.parentCode==form.parentCode0" :disabled="form.id!=null"
                           :key="dict.code" :label="dict.chineseName" :value="dict.code" />
              </el-select>
            </el-form-item>
            <el-form-item label="中类" prop="parentCode2" v-if="form.level>2">
              <el-select v-model="form.parentCode2" placeholder="请选择分类级别" style="width: 100%">
                <el-option class="index-option" v-for="dict in $store.state.factorDict.productCategorizeDict2" v-if="dict.parentCode==form.parentCode1" :disabled="form.id!=null"
                           :key="dict.code" :label="dict.chineseName" :value="dict.code" />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :lg="24"  >
            <el-form-item label="编码" prop="code">
              <el-input v-model="form.code" placeholder="请输入编码" :readonly="form.id!=null"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :lg="24"  >
            <el-form-item label="中文名称" prop="chineseName">
              <el-input v-model="form.chineseName" placeholder="请输入中文名称" />
            </el-form-item>
          </el-col>

          <el-col :xs="24" :sm="24" :lg="24"  >
            <el-form-item label="排序" prop="orderNum" >
              <el-input v-model="form.orderNum" placeholder="请输入排序" @blur="verifyNumDefault(form,'orderNum',0,null)"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="24" :lg="24"  >
            <el-form-item label="状态" prop="status" style="margin-bottom: 0">
              <el-radio-group v-model="form.status">
                <el-radio v-for="dict in $store.state.factorDict.statusOptions"
                          :key="dict.dictValue" :label="dict.dictValue">{{dict.dictLabel}}</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
</template>

<script>
import { listProductCategorize, getProductCategorize, delProductCategorize, addProductCategorize, updateProductCategorize, exportProductCategorize } from "@/api/factor/productCategorize";
export default {
  name: "ProductCategorize",
  data() {
    return {
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        parentCode: [{ required: true, message: "请选择上级分类", trigger: "change" }],
        parentCode0: [{ required: true, message: "请选择门类", trigger: "change" }],
        parentCode1: [{ required: true, message: "请选择大类", trigger: "change" }],
        parentCode2: [{ required: true, message: "请选择中类", trigger: "change" }],
        type: [{ required: true, message: "请选择分类类型", trigger: "change" }],
        level: [{ required: true, message: "请选择分类级别", trigger: "change" }],
        chineseName: [{ required: true, message: "请输入中文名称", trigger: "blur" }],
        code: [{ required: true, message: "请输入分类编码", trigger: "blur" }],
        status: [{ required: true, message: "请选择状态", trigger: "change" }],

      }
    };
  },
  created() {

  },
  methods: {
    /** 转换碳排放因子数据库数据结构 */
    normalizer(node) {
      if (node.children && !node.children.length) {
        delete node.children;
      }
      return {
        id: node.code_key,
        label: node.chineseName,
        children: node.children
      };
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        code: null,
        parentCode: null,
        parentCode0: null,
        parentCode1: null,
        parentCode2: null,
        ancestors: null,
        chineseName: null,
        level: 0,
        status: 1,
        orderNum: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null
      };
      this.resetForm("form");
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加产品分类";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      if (row != null) {
        this.form.parentCode = row.code;
      }
      getProductCategorize(row.id ).then(response => {
        if(response.data.ancestors){
          let arr = response.data.ancestors.split(",");
          if(arr.length>1){
            response.data.parentCode0 = arr[1]
          }
          if(arr.length>2){
            response.data.parentCode1 = arr[2]
          }
          if(arr.length>3){
            response.data.parentCode2 = arr[3]
          }
        }
        this.form = response.data;
        this.open = true;
        this.title = "修改产品分类";
      });
    },
    /** 提交按钮 */
    submitForm() {
      if(this.form.level==0){
        this.form.parentCode = "0";
      }else if(this.form.level==1){
        this.form.parentCode = this.form.parentCode0 ;
      }else if(this.form.level==2){
        this.form.parentCode = this.form.parentCode1 ;
      }else if(this.form.level==3){
        this.form.parentCode = this.form.parentCode2 ;
      }
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateProductCategorize(this.form).then(response => {
              if (response.code === '200') {
                this.msgSuccess("修改成功");
                this.open = false;
                this.$emit("getList");
              }
            });
          } else {
            addProductCategorize(this.form).then(response => {
              if (response.code === '200') {
                this.msgSuccess("新增成功");
                this.open = false;
                this.$emit("getList");
              }
            });
          }
        }
      });
    },
  }
};
</script>
